<!DOCTYPE html>
<html   xmlns="http://www.w3c.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head/>
    <h:body>
        <p:panel id="pnl" header="Draggable Panel">
            <h:outputText value="I am dragged on an axis only" />
        </p:panel>
        
        <p:draggable for="pnl" revert="true" opacity="0.5" grid="20,40"/>
        
        <p:panel id="pnk" header="Draggable Panel">
            <h:outputText value="I am cloned" />
        </p:panel>
        
        <p:draggable for="pnk" helper="clone"/>
        
        <p:outputPanel layout="block" style="width:400px;height:200px;">
            <p:panel id="conpnl" header="Restricted">
                <h:outputText value="I am restricted to my parent's boundaries" />
            </p:panel>
        </p:outputPanel>
        
        <p:draggable for="conpnl" containment="parent" />
    </h:body>
</html>
